<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
      <div v-if="crud.props.searchToggle">
        <el-button class="filter-item" size="mini" type="primary" @click="changeView">{{ viewtitle }}</el-button>
        <!-- 搜索 -->
        <el-input v-model="crud.queryInput.value" clearable placeholder="输入搜索内容" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
        <el-select v-model="crud.queryInput.type" clearable placeholder="类型" class="filter-item" style="width: 130px">
          <el-option v-for="item in queryTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
        </el-select>
        <label class="filter-item timeAreaLable">入职时间:</label>
        <el-date-picker
          v-model="timeRange"
          type="daterange"
          range-separator="~"
          start-placeholde="入职时间范围"
          size="small"
          class="date-item"
          end-placeholde="入职时间范围"
          value-format="yyyy-MM-dd"
          align="right"
          @change="changeHander(timeRange)"
        />
        <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="crud.toQuery">搜索</el-button>
        <el-button class="filter-item" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQy">重置</el-button>
      </div>
      <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
      <crudOperation ref="crudOperation" :permission="permission" />
      <!--表单组件-->
      <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="540px">
        <el-form ref="form" :model="form" :rules="rules" size="small" label-width="120px">
          <el-form-item v-if="pAdd === false || viewcount !== 2" label="姓名" prop="empName">
            <el-input v-model="form.empName" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-else-if="pAdd === true || viewcount === 2" label="姓名" prop="id">
            <person-select :value="[form.centerBase.departmentId.id, form.centerBelong, form.id]" @input="personSelectInput" />
          </el-form-item>
          <el-form-item v-if="pAdd === false || viewcount !== 2" label="性别" prop="sex">
            <!-- 手动设置 radio -->
            <el-radio-group v-model="form.sex" style="width: 178px">
              <el-radio label="男">男</el-radio>
              <el-radio label="女">女</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="pAdd === false || viewcount !== 2" label="出生日期" prop="birthday">
            <el-date-picker v-model="form.birthday" type="datetime" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="身份证" prop="idCard">
            <el-input v-model="form.idCard" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="入所时间">
            <el-date-picker v-model="form.join" type="datetime" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="籍贯">
            <el-input v-model="form.nativePlace" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="民族">
            <el-input v-model="form.nation" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="最高学历">
            <el-input v-model="form.highestEdu" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="最高学位">
            <el-input v-model="form.highestDegree" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="学校1（本科）">
            <el-input v-model="form.firstSchool" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="专业1">
            <el-input v-model="form.firstMajor" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="学校2（研究生）">
            <el-input v-model="form.secondSchool" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="专业2">
            <el-input v-model="form.secondMajor" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="pAdd === false || viewcount !== 2" label="职称" prop="title">
            <el-input v-model="form.title" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="获得此职称时间">
            <el-date-picker v-model="form.titleBeginTime" type="datetime" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="专业等级">
            <el-input v-model="form.professionalLevel" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="手机号" prop="phone">
            <el-input v-model="form.phone" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="联系人">
            <el-input v-model="form.relationMember" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="联系人手机号">
            <el-input v-model="form.familyPhone" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="详细家庭住址" prop="address">
            <el-input v-model="form.address" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="婚姻情况">
            <el-input v-model="form.maritalStatus" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="子女情况">
            <el-input v-model="form.childrenSituation" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="政治面貌" prop="politicsStatus">
            <el-input v-model="form.politicsStatus" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="涉密等级" prop="secretLevel">
            <!-- <el-input v-model="form.secretLevel" style="width: 370px;" /> -->
            <el-radio-group v-model="form.secretLevel" style="width: 300px">
              <el-radio label="核心">核心</el-radio>
              <el-radio label="重要">重要</el-radio>
              <el-radio label="一般">一般</el-radio>
              <el-radio label="非密">非密</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="工作证编号" prop="workerNumber">
            <el-input v-model="form.workerNumber" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="邮箱">
            <el-input v-model="form.email" style="width: 370px;" />
          </el-form-item>

          <el-form-item v-if="pAdd === false" label="所属中心" prop="centerBelong">
            <center-select :value="[form.centerBase.departmentId.id,form.centerBelong]" style="width: 370px;" @input="centerSelectInput" />
          </el-form-item>

          <el-form-item v-else-if="viewcount !== 2 && pAdd === true" label="所属中心" prop="centerBelong">
            <center-select :value="[form.centerBase.departmentId.id,form.centerBelong]" @input="centerSelectInputAdd" />
          </el-form-item>

          <el-form-item v-if="viewcount === 2" label="离职时间" prop="leaveTime">
            <el-date-picker v-model="form.leaveTime" type="datetime" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount === 2" label="离职原因">
            <el-input v-model="form.leaveReason" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount === 2" label="离职说明">
            <el-input v-model="form.leaveInf" :rows="3" type="textarea" style="width: 370px;" />
          </el-form-item>
          <el-form-item v-if="viewcount !== 2" label="前单位">
            <el-input v-model="form.formerUnit" :rows="3" type="textarea" style="width: 370px;" />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="text" @click="crud.cancelCU">取消</el-button>
          <el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
        </div>
      </el-dialog>

      <el-dialog :close-on-click-modal="false" :before-close="zxCancel" :visible.sync="visible" title="员工中心发生变动" width="540px">
        <el-form ref="form3" :model="form3" :rules="rules2" size="small" label-width="120px">
          <el-form-item label="变动时间" prop="changeTime">
            <el-date-picker v-model="form3.changeTime" type="datetime" style="width: 370px;" />
          </el-form-item>
          <el-form-item label="变动说明" prop="changeReason">
            <el-input v-model="form3.changeReason" :rows="3" type="textarea" style="width: 370px;" />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="text" @click="zxCancel">取消</el-button>
          <el-button :loading="crud.cu === 2" type="primary" @click="zxSubmit">确认</el-button>
        </div>
      </el-dialog>
      <el-dialog :close-on-click-modal="false" :before-close="lzCancel" :visible.sync="leaveVisible" title="离职操作" width="540px">
        <el-form ref="form4" :model="form4" :rules="rules3" size="small" label-width="120px">
          <el-form-item label="是否离职" prop="isLeave">
            <el-select v-model="form4.isLeave" placeholder="离职">
              <el-option
                v-for="item in leaveOptions"
                :key="item.key"
                :label="item.display_name"
                :value="item.key"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="离职时间" prop="leaveTime">
            <el-date-picker v-model="form4.leaveTime" type="datetime" style="width: 370px;" />
          </el-form-item>
          <el-form-item label="离职原因" prop="leaveReason">
            <el-input v-model="form4.leaveReason" :rows="3" type="textarea" style="width: 370px;" />
          </el-form-item>
          <el-form-item label="离职说明" prop="leaveInf">
            <el-input v-model="form4.leaveInf" :rows="3" type="textarea" style="width: 370px;" />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="text" @click="lzCancel">取消</el-button>
          <el-button :loading="crud.cu === 2" type="primary" @click="lzSubmit">确认</el-button>
        </div>
      </el-dialog>
      <!--表格渲染-->
      <el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
        <el-table-column type="selection" width="40" />

        <el-table-column v-if="columns.visible('id')" key="1" prop="id" label="ID" width="40" />
        <el-table-column v-if="columns.visible('empName')" key="2" prop="empName" label="姓名" width="80" />
        <el-table-column v-if="columns.visible('sex')" key="3" prop="sex" label="性别" width="80" />
        <el-table-column v-if="columns.visible('birthday')" key="4" prop="birthday" label="出生日期" width="90">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.birthday, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        <el-table-column v-if="columns.visible('idCard') && viewcount !== 2" key="5" prop="idCard" label="身份证" width="140" />
        <el-table-column v-if="columns.visible('join') && viewcount !== 2" prop="join" label="入所时间" width="90">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.join, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        <el-table-column v-if="columns.visible('nativePlace') && viewcount !== 2" key="6" prop="nativePlace" label="籍贯" />
        <el-table-column v-if="columns.visible('nation') && viewcount !== 2" key="7" prop="nation" label="民族" />
        <el-table-column v-if="columns.visible('highestEdu') && viewcount !== 2" key="8" prop="highestEdu" label="最高学历" />
        <el-table-column v-if="columns.visible('highestDegree') && viewcount !== 2" key="9" prop="highestDegree" label="最高学位" />
        <el-table-column v-if="columns.visible('firstSchool') && viewcount !== 2" key="10" prop="firstSchool" label="学校1（本科）" />
        <el-table-column v-if="columns.visible('firstMajor') && viewcount !== 2" key="11" prop="firstMajor" label="专业1" />
        <el-table-column v-if="columns.visible('secondSchool') && viewcount !== 2" key="12" prop="secondSchool" label="学校2（研究生）" />
        <el-table-column v-if="columns.visible('secondMajor') && viewcount !== 2" key="13" prop="secondMajor" label="专业2" />
        <el-table-column v-if="columns.visible('title')" key="14" prop="title" label="职称" />
        <el-table-column v-if="columns.visible('titleBeginTime') && viewcount !== 2" key="15" prop="titleBeginTime" label="获得此职称的时间" width="90">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.titleBeginTime, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        <el-table-column v-if="columns.visible('professionalLevel') && viewcount !== 2" key="16" prop="professionalLevel" label="专业等级" />
        <el-table-column v-if="columns.visible('phone')" key="17" prop="phone" label="手机号" />
        <el-table-column v-if="columns.visible('relationMember') && viewcount !== 2" key="18" prop="relationMember" label="联系人" />
        <el-table-column v-if="columns.visible('familyPhone') && viewcount !== 2" key="19" prop="familyPhone" label="联系人手机号" />
        <el-table-column v-if="columns.visible('address') && viewcount !== 2" key="20" prop="address" label="家庭住址（详细）" />
        <el-table-column v-if="columns.visible('maritalStatus') && viewcount !== 2" key="21" prop="maritalStatus" label="婚姻情况" />
        <el-table-column v-if="columns.visible('childrenSituation') && viewcount !== 2" key="22" prop="childrenSituation" label="子女情况" />
        <el-table-column v-if="columns.visible('politicsStatus') && viewcount !== 2" key="23" prop="politicsStatus" label="政治面貌" />
        <el-table-column v-if="columns.visible('secretLevel') && viewcount !== 2" key="24" prop="secretLevel" label="涉密等级" />
        <el-table-column v-if="columns.visible('workerNumber') && viewcount !== 2" key="25" prop="workerNumber" label="工作证编号" />
        <el-table-column v-if="columns.visible('email') && viewcount !== 2" key="26" prop="email" label="邮箱" />
        <el-table-column v-if="columns.visible('centerBase.centerName')" key="27" prop="centerBase.centerName" label="所属中心">
          <template slot-scope="scope">
            <router-link :to="{ path: '/org/org/center_base', query: {mode: 'ONE',id: scope.row.centerBelong }}">
              <el-tag>
                {{ scope.row.centerBase.centerName }}
              </el-tag>
            </router-link>
          </template>
        </el-table-column>
        <el-table-column v-if="columns.visible('leaveTime') && viewcount === 3" key="29" prop="leaveTime" label="是否离职">
          <template slot-scope="scope">
            <span v-if="scope.row.leaveTime === null ">否</span>
            <span v-else-if="scope.row.leaveTime !== null">是</span>
          </template>
        </el-table-column>
        <el-table-column v-if="columns.visible('formerUnit') && viewcount !== 2" key="30" prop="formerUnit" label="前单位" />
        <!-- <el-table-column v-if=" viewcount === 3"  label="是否离职"> -->

        <el-table-column v-if="columns.visible('leaveTime') && viewcount === 2" prop="leaveTime" label="离职时间">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.leaveTime, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        <el-table-column v-if="columns.visible('leaveReason') && viewcount === 2" prop="leaveReason" label="离职原因" />
        <el-table-column v-if="columns.visible('leaveInf') && viewcount === 2" prop="leaveInf" label="离职说明" />
        <el-table-column key="28" label="离职管理" fixed="right" align="center" width="80">
          <template slot-scope="scope">
            <el-button type="mini" icon="el-icon-edit" @click="changeView2(scope.row)" />
          </template>
        </el-table-column>
        <el-table-column v-permission="['admin','employeeBase:edit','employeeBase:del']" fixed="right" label="操作" width="150px" align="center">
          <template slot-scope="scope">
            <udOperation
              ref="udOperation"
              :data="scope.row"
              :permission="permission"
            />
          </template>
        </el-table-column>
      </el-table>
      <!--分页组件-->
      <pagination />
    </div>
  </div>
</template>

<script>
import crudEmployeeBase from '@/api/employeeBase'
import { edit as edit2 } from '@/api/employeeBase'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import { initData } from '@/api/data'
import centerSelect from '@/views/components/cascader/center_cascader'
import { edit } from '@/api/employeeChange'
import { parseTime } from '@/utils/index'
import personSelect from '@/views/components/cascader/person_cascader'

// crud交由presenter持有
const defaultCrud = CRUD({ title: '人员基本信息', url: 'api/employeeBase', sort: 'id,asc', crudMethod: { ...crudEmployeeBase }})
const defaultForm = {
  centerBase: { departmentId: { id: null }},
  id: null,
  empName: null,
  sex: null,
  birthday: null,
  idCard: null,
  join: null,
  nativePlace: null,
  nation: null,
  highestEdu: null,
  highestDegree: null,
  firstSchool: null,
  firstMajor: null,
  secondSchool: null,
  secondMajor: null,
  title: null,
  titleBeginTime: null,
  professionalLevel: null,
  phone: null,
  relationMember: null,
  familyPhone: null,
  address: null,
  maritalStatus: null,
  childrenSituation: null,
  politicsStatus: null,
  secretLevel: null,
  workerNumber: null,
  email: null,
  // centerBelong: { id: null },
  centerBelong: null,
  leaveTime: null,
  leaveReason: null,
  leaveInf: null,
  formerUnit: null,
  isLeave: null
}

export default {
  name: 'EmployeeBase',
  components: { pagination, crudOperation, udOperation, centerSelect, personSelect },
  mixins: [presenter(defaultCrud), header(), form(defaultForm), crud()],
  data() {
    return {
      permission: {
        add: ['admin', 'employeeBase:add'],
        edit: ['admin', 'employeeBase:edit'],
        del: ['admin', 'employeeBase:del']
      },
      rules: {
        empName: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        sex: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        birthday: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        idCard: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        title: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        phone: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        address: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        politicsStatus: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        secretLevel: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        workerNumber: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        centerBelong: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        leaveTime: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ]
      },
      rules2: {
        changeTime: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ],
        changeReason: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ]
      },
      rules3: {
        leaveTime: [
          { required: true, message: '必须填写该项', trigger: 'blur' }
        ]
      },
      queryTypeOptions: [
        { key: 'centerName', display_name: '所属中心' },
        { key: 'empName', display_name: '姓名' },
        { key: 'sex', display_name: '性别' },
        { key: 'nativePlace', display_name: '籍贯' },
        { key: 'nation', display_name: '民族' },
        { key: 'highestEdu', display_name: '最高学历' },
        { key: 'highestDegree', display_name: '最高学位' },
        { key: 'firstSchool', display_name: '学校1（本科）' },
        { key: 'firstMajor', display_name: '专业1' },
        { key: 'secondSchool', display_name: '学校2（研究生）' },
        { key: 'secondMajor', display_name: '专业2' },
        { key: 'title', display_name: '职称' },
        { key: 'professionalLevel', display_name: '专业等级' },
        { key: 'phone', display_name: '手机号' },
        { key: 'relationMember', display_name: '联系人' },
        { key: 'familyPhone', display_name: '联系人手机号' },
        { key: 'maritalStatus', display_name: '婚姻情况' },
        { key: 'childrenSituation', display_name: '子女情况' },
        { key: 'politicsStatus', display_name: '政治面貌' },
        { key: 'secretLevel', display_name: '涉密等级' },
        { key: 'workerNumber', display_name: '工作证编号' },
        // { key: 'leaveReason', display_name: '离职原因' },
        // { key: 'leaveInf', display_name: '离职说明' },
        { key: 'formerUnit', display_name: '前单位' }
      ],
      queryTypeOptions2: [
        { key: 'centerName', display_name: '所属中心' },
        { key: 'empName', display_name: '姓名' },
        { key: 'sex', display_name: '性别' },
        { key: 'title', display_name: '职称' }
      ],
      viewtitle: '在职视图',
      viewcount: 1,
      leaveVisible: false,
      visible: false,
      fromcenterid: null,
      tocenterid: null,
      changeTime: null,
      changeReason: null,
      timeRange: [],
      // timeRange: null,
      pAdd: false,
      form2: {
        id: '',
        empId: '',
        fromCenterId: '',
        toCenterId: '',
        changeTime: '',
        describe: ''
      },
      form3: {
        changeTime: null,
        changeReason: null
      },
      form4: {
        isLeave: null,
        leaveTime: null,
        leaveReason: null,
        leaveInf: null
      },
      employeeState: null,
      leaveEnum: {
        Leave: 0, // 离职
        onJob: 1, // 在职
        all: 2 // 所有
      },
      leaveOptions: [
        { key: '离职', display_name: '离职' },
        { key: '在职', display_name: '在职' }
      ],
      // select: '离职',
      rid: null,
      rcenterid: null,
      rdepid: null,
      flag: 0,
      centerAll: []
    }
  },

  created() {
    this.getCenterAll()
  },
  methods: {
    // 获取数据前设置好接口地址
    [CRUD.HOOK.beforeRefresh]() {
      // const query = this.query
      // if (query.type && query.value) {
      //   this.crud.params[query.type] = query.value
      // }
      // 叠加queryInput中的搜索条件
      if (this.viewcount === 1) {
        this.crud.query['isLeave'] = '0'
      }
      if (this.crud.queryInput.type && this.crud.queryInput.value) {
        this.crud.query[this.queryInput.type] = this.queryInput.value
      }
      return true
    },
    getCenterAll() {
      return new Promise((resolve, reject) => {
        // 请求数据
        initData('api/centerBase',
          { page: -1, size: 99999, sort: 'id,desc' }
        ).then(data => {
          // 获得数据
          this.centerAll = data.content
          resolve(data)
        }).catch(err => {
          reject(err)
        })
      })
    },
    beforeCrudToAdd() {
      this.pAdd = true
    },
    afterCrudRefresh() {
    },
    beforeCrudToEdit() {
      const f = JSON.parse(JSON.stringify(this.form))
      this.fromcenterid = f.centerBelong
      this.pAdd = false
    },
    beforeCrudSubmitCU() {
      // 提交前处理this.crud.form数据
      const f = JSON.parse(JSON.stringify(this.form))
      f.centerBase = null
      this.crud.form = f
    },
    afterCrudSubmitCU() {
      if (this.flag === 1) {
        this.form2 = {
          empId: this.form.id,
          fromCenterId: this.fromcenterid,
          toCenterId: this.tocenterid,
          changeTime: this.form3.changeTime,
          describe: this.form3.changeReason
        }
        edit(this.form2).then(res => {
        })
      }
      // 提交后还原
      this.crud.form = this.form
      this.tocenterid = null
      this.changeTime = null
      this.changeReason = null
      this.flag = 0
    },
    zxSubmit() {
      this.visible = false
      this.flag = 1
      if (this.form3.changeTime !== null && this.form3.changeReason != null && this.form.centerBelong !== this.rcenterid) {
        this.form.centerBase.departmentId.id = this.rid
        this.form.centerBelong = this.rcenterid
      }
    },
    zxCancel() {
      this.visible = false
    },
    changeView() {
      // 在职
      if (this.viewcount === 1) {
        this.viewcount = 2
        this.viewtitle = '离职视图'
        this.crud.query['isLeave'] = '1'
      } else if (this.viewcount === 2) { // 离职
        this.viewcount = 3
        this.viewtitle = '全部视图'
        this.crud.query['isLeave'] = null
      } else { // 全部
        this.viewcount = 1
        this.viewtitle = '在职视图'
        this.crud.query['isLeave'] = '0'
      }
      this.crud.refresh()
    },
    changeView2(data) {
      this.leaveVisible = true // 打开el-dialog
      if (data.leaveTime === null) {
        this.form4.isLeave = '在职'
      } else {
        this.form4.isLeave = '离职'
      }
      this.form4.leaveTime = data.leaveTime
      this.form4.leaveReason = data.leaveReason
      this.form4.leaveInf = data.leaveInf
      this.form = this.crud.form
      this.crud.form = data
    },
    resetQy() {
      this.crud.queryInput.type = null
      this.crud.queryInput.value = null
      this.crud.query = {}
      this.crud.params = {}
      // 在职
      if (this.viewcount === 1) {
        this.crud.query['isLeave'] = '0'
      } else if (this.viewcount === 2) { // 离职
        this.crud.query['isLeave'] = 1
      } else { // 全部
        this.crud.query['isLeave'] = null
      }
      this.crud.refresh()
    },
    lzSubmit() {
      if (this.form4.leaveTime !== null) {
        this.leaveVisible = false
        if (this.crud.form.leaveTime === null) {
          this.crud.form.leaveTime = this.form4.leaveTime
          this.crud.form.leaveReason = this.form4.leaveReason
          this.crud.form.leaveInf = this.form4.leaveInf
          if (this.form4.leaveTime !== null) {
            this.crud.form.isLeave = '1'
          }
        } else if (this.crud.form.leaveTime !== null) {
          if (this.form4.isLeave === '离职') {
            this.crud.form.leaveTime = this.form4.leaveTime
            this.crud.form.leaveReason = this.form4.leaveReason
            this.crud.form.leaveInf = this.form4.leaveInf
          } else {
            this.crud.form.leaveTime = null
            this.crud.form.leaveReason = ''
            this.crud.form.leaveInf = ''
            this.crud.form.isLeave = '0'
          }
        }
        edit2(this.crud.form).then(res => {
        })
        this.crud.refresh()
        // this.crud.refresh()
        // this.crud.refresh()
        this.crud.form = this.form
      }
    },
    changeHander(timeRange) {
      if (timeRange != null && timeRange.length === 2) {
        this.crud.query['join1'] = parseTime(timeRange[0])
        this.crud.query['join2'] = parseTime(timeRange[1])
        this.crud.refresh()
      }
    },
    lzCancel() {
      this.leaveVisible = false
      this.crud.form = this.form
    },
    personSelectInput(e) {
      this.form.centerBase.departmentId.id = e[0]
      this.form.centerBelong = e[1]
      this.form.id = e[2]
    },
    centerSelectInputAdd(e) {
      this.form.centerBase.departmentId.id = e[0]
      this.form.centerBelong = e[1]
    },
    centerSelectInput(e) {
      this.visible = true // 打开el-dialog
      this.tocenterid = e[1]
      this.form3.changeTime = null
      this.form3.changeReason = null
      this.rid = e[0]
      this.rcenterid = e[1]
    }
  }
}
</script>

<style>
.timeAreaLable {
  font-size: 12px;
  vertical-align: middle;
  text-align: center;
  color: #99a9bf;
}
</style>
